<template>
  <mu-dialog transition="slide-right" fullscreen :open.sync="open">
    <div class="p-box">
      <div class="p-return">
        <mu-appbar color="primary" class="lan-header">
          <mu-button icon slot="left" @click="close">
            <i class="iconfont angle-left iconangle-left"></i>
            <span class="lan-header-back">返回</span>
          </mu-button>选择商铺
        </mu-appbar>
      </div>
      <div class="p-content" style="background:#fff;">
        <mu-list style>
          <mu-list-item
            v-for="(list, index) in lists"
            button
            style="box-shadow:0rem 0.01rem 0rem 0rem rgba(224,224,224,1);"
            :key="index"
            @click="select(list)"
          >
            <mu-list-item-title>{{list.shopName}}</mu-list-item-title>
            <div style="width: .2rem;position: absolute;right: 0.14rem;" v-if="shop.id==list.id">
              <i class="iconfont iconxuanze" style="color: #24D90C;"></i>
            </div>
          </mu-list-item>
        </mu-list>
      </div>
    </div>
  </mu-dialog>
</template>
<script>
export default {
  name: "",
  components: {},
  props: {
    lists: {
      type: Array,
      default: () => {
        return [];
      }
    },

    shop: {
      type: Object,
      default: () => {
        return {
          id: ""
        };
      }
    }
  },
  model: {
    prop: "shop",
    event: "change"
  },
  data() {
    return {
      open: false
    };
  },
  computed: {},
  created() {},
  mounted() {},
  watch: {},
  methods: {
    init() {
      this.open = true;
    },
    // 获取店铺列表
    select(list) {
      this.$emit("change", list);
      this.open = false;
    },
    close() {
      this.open = false;
    },
    //点击确定
    confirm() {
      this.close();
    }
  },
  destroyed() {}
};
</script>
<style lang="less">
</style>
